<template>
  <div class="app-container">
    <div style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);width: 98%;margin: 0 auto;height: 80px">
      <el-row :gutter="10" class="mb8" style="line-height: 80px;float: right;margin-right: 20px">
        <el-col :span="1.5">
          <el-button
            type="primary"
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd"
            v-hasPermi="['drug:purchase:addPurchase']"
            :disabled="this.state"
          >添加药品</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            icon="el-icon-s-operation"
            size="mini"
            @click="sets"
            v-hasPermi="['drug:purchase:update']"
            :disabled="this.state"
          >批量设置</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="warning"
            icon="el-icon-check"
            size="mini"
            @click="submitDurd"
            v-hasPermi="['drug:purchase:update']"
            :disabled="this.state"
          >暂存</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            icon="el-icon-finished"
            size="mini"
            @click="submitDurdTwo"
            v-hasPermi="['drug:purchase:update']"
            :disabled="this.state"
          >提交审核</el-button>
        </el-col>
      </el-row>
    </div>

    <div style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);width: 98%;margin: 10px auto;height: 200px;padding: 20px">
        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
          <el-row style="margin-top: 10px">
            <el-col :span="5">
              <el-form-item label="单据号" style="width: 300px">
                <el-input v-model="form.dpid" :disabled="true" ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5">
              <el-form-item label="制单人" style="width: 300px">
                <el-input v-model="form.applyUser" :disabled="true" />
              </el-form-item>
            </el-col>
              <el-col :span="5">
                <el-form-item label="供应商" prop="dsid">
                  <el-select v-model="form.dsid" placeholder="请选择供应商" clearable size="small" :disabled="this.state">
                    <el-option
                      v-for="supplier in supplierList"
                      :key="supplier.dsid"
                      :label="supplier.dsName"
                      :value="supplier.dsid"
                    />
                  </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="5">
              <el-form-item label="制单时间" prop="createTime" style="width: 300px">
                <el-date-picker type="datetime" v-model="form.createTime" format="yyyy-MM-dd HH:mm:ss"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                :style="{width: '100%'}"
                                placeholder="请选择制单时间"
                                clearable
                                :disabled="this.state">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="5">
              <el-form-item label="总批发额" style="width: 300px;margin-top: 10px">
                <el-input v-model="form.dpTotalAmount" :disabled="true" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
    </div>

    <div style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);width: 98%;margin: 10px auto;padding: 20px">

      <div v-if="this.state">
        <el-table v-loading="loading" :data="drugList" @selection-change="handleSelectionChange" border="0px">
          <el-table-column label="药品ID" align="center" prop="ddid" width="80"/>
          <el-table-column label="药品名称" align="center" prop="druDrug.ddName"/>
          <el-table-column label="规格" align="center" prop="druDrug.ddUnit" width="100"/>
          <el-table-column label="生产厂家" align="center" prop="druDrug.druManufacturer.dmName"/>
          <el-table-column label="数量" align="center" prop="drugNum" width="150"/>
          <el-table-column label="单位" align="center" prop="druDrug.ddUnit" width="80"/>
          <el-table-column label="批发价" align="center" prop="tradePrice" width="150"/>
          <el-table-column label="批发额" align="center" prop="" width="130" >
            <template slot-scope="scope">
              <span v-text="(scope.row.tradePrice)*(scope.row.drugNum)"></span>
            </template>
          </el-table-column>
          <el-table-column label="批次号" align="center" prop="batch" width="110"/>
          <el-table-column label="备注" align="center" prop="remark"/>
          <el-table-column label="操作" align="center" prop="createTime" width="180">
            <el-button
              type="danger"
              icon="el-icon-delete"
              size="mini"
              @click="handleDelete"
              v-hasPermi="['drug:purchase:delete']"
              :disabled="this.state"
            >删除</el-button>
          </el-table-column>
        </el-table>
      </div>
      <div v-else>
        <el-table v-loading="loading" :data="drugList" @selection-change="handleSelectionChange" border="0px">
          <el-table-column label="药品ID" align="center" prop="druDrug.ddid" width="80"/>
          <el-table-column label="药品名称" align="center" prop="druDrug.ddName"/>
          <el-table-column label="规格" align="center" prop="druDrug.ddUnit" width="100"/>
          <el-table-column label="生产厂家" align="center" prop="druDrug.druManufacturer.dmName"/>
          <el-table-column label="数量" align="center" prop="drugNum" width="150">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.drugNum"
                style="width: 100px"
                size="mini"
                :min="1"
                @change="setPrice()">
              </el-input-number>
            </template>
          </el-table-column>
          <el-table-column label="单位" align="center" prop="druDrug.ddUnit" width="80"/>
          <el-table-column label="批发价" align="center" prop="druDrug.ddPrice" width="150">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.tradePrice"
                style="width: 100px"
                size="mini"
                :min="0"
                @change="setPrice()"
              >
              </el-input-number>
            </template>
          </el-table-column>
          <el-table-column label="批发额" align="center" prop="" width="130" >
            <template slot-scope="scope">
              <span v-text="(scope.row.tradePrice)*(scope.row.drugNum)"></span>
            </template>
          </el-table-column>
          <el-table-column label="批次号" align="center" prop="batch" width="110">
            <template slot-scope="scope">
              <el-input v-model="scope.row.batch"/>
            </template>
          </el-table-column>
          <el-table-column label="备注" align="center" prop="remark">
            <template slot-scope="scope">
              <el-input v-model="scope.row.remark"/>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" prop="createTime" width="180">
            <template slot-scope="scope">
              <el-button
                type="danger"
                icon="el-icon-delete"
                size="mini"
                @click="deleteDrug(scope.row)"
                v-hasPermi="['drug:purchase:delete']"
              >删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <el-dialog :title="title" align="center" :visible.sync="open" width="1000px" append-to-body>

      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="药品名称" prop="ddName">
          <el-input
            v-model="queryParams.ddName"
            style="width: 200px"
            placeholder="请输入药品名称"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
            @change="getDrugs()"
          />
        </el-form-item>

        <el-form-item label="药品类型" prop="ddType">
          <el-select v-model="queryParams.ddType" placeholder="药品类型" clearable size="small" style="width: 200px" @change="getDrugs()">
            <el-option
              v-for="type in ddTypes"
              :key="type.ddType"
              :label="type.ddType"
              :value="type.ddType"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="处方类型" prop="ddPrescriptionType">
          <el-select v-model="queryParams.ddPrescriptionType" placeholder="处方类型" clearable size="small" style="width: 200px" @change="getDrugs()">
            <el-option
              v-for="prescriptionType in prescriptionTypes"
              :key="prescriptionType.ddPrescriptionType"
              :label="prescriptionType.ddPrescriptionType"
              :value="prescriptionType.ddPrescriptionType"
            />
          </el-select>
        </el-form-item>

      </el-form>


      <el-table v-loading="loading" :data="newAddDrugs" @selection-change="handleSelectionChange" border="0px">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="药品ID" align="center" prop="ddid" width="70"/>
        <el-table-column label="药品名称" align="center" prop="ddName"/>
        <el-table-column label="药品编码" align="center" prop="ddCoding" width="100"/>
        <el-table-column label="生产厂家" align="center" prop="druManufacturer.dmName"/>
        <el-table-column label="药品类型" align="center" prop="ddType"  width="100"/>
        <el-table-column label="处方类型" align="center" prop="ddPrescriptionType"  width="100"/>
        <el-table-column label="价格" align="center" prop="ddPrice"  width="100"/>
      </el-table>

      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getDrugs"
      />

      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>

    </el-dialog>


    <el-dialog :title="title"  :visible.sync="openTwo" width="600px" append-to-body>
      <el-form ref="elForm" :model="formTwo" :rules="rules" size="medium" label-width="100px">
        <el-form-item label="数量" prop="field101">
          <el-input-number v-model="formTwo.drugNum" placeholder="数量" :min="0"></el-input-number>
        </el-form-item>
        <el-form-item label="批发价格" prop="field102">
          <el-input-number v-model="formTwo.tradePrice" placeholder="批发价格" :min="0" :precision='2'></el-input-number>
        </el-form-item>
        <el-form-item label="批次号" prop="field103">
          <el-input v-model="formTwo.batch" placeholder="请输入批次号" clearable :style="{width: '100%'}">
          </el-input>
        </el-form-item>
        <el-form-item label="备注" prop="field104">
          <el-input v-model="formTwo.remark" placeholder="请输入备注" clearable :style="{width: '100%'}">
          </el-input>
        </el-form-item>
        <el-form-item size="large">
          <el-button type="primary" @click="setsAffirm">确定</el-button>
          <el-button @click="cancel">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import { selectParticulars,selectSupplier,suboptimal,updatepurchase } from "@/api/drug/purchase";
  import {selectAll,selectDdType,selectPrescriptionType,selectDdTypeDe} from "@/api/drug/drugInformation";
  import {deepClone} from "../../../utils";


  export default {
    name: "Data",
    data() {
      return {
        ddids:[],
        priceSum:null,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 采购订单状态
        state:true,
        // 采购单详情
        purchase:undefined,
        // 采购单药品详情集合
        drugList: [],
        newDrugList: [],
        // 供应商信息集合
        supplierList: [],
        // 药品类型全部数据
        ddTypes: [],
        // 处方类型全部数据
        prescriptionTypes: [],
        // 药品表格数据
        addDrugs: [],
        newAddDrugs: [],
        // 选中药品对象
        item: [],
        // 药品信息详情
        druPurchaseDrug:{
          dpdid:undefined,
          dpid:undefined,
          ddid:undefined,
          batch: "无",
          druDrug: undefined,
          drugNum: 1,
          remark: "无",
          tradePrice: undefined
        },
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        openTwo: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          dictName: undefined,
          dictType: undefined,
          status: undefined,
        },
        // 表单参数
        form: {
          dpTotalAmount:null,
        },
        // 表单参数
        formTwo: {
          drugNum: undefined,
          tradePrice: undefined,
          batch: undefined,
          remark:undefined
        },
        // 表单校验
        rules: {
          createTime: [
            { required: true, message: "数据标签不能为空", trigger: "blur" }
          ],
          dsid: [
            { required: true, message: "药品名称不能为空", trigger: "blur" }
          ],
        }
      };
    },
    created() {
      const dpid = this.$route.params && this.$route.params.dpid;
      const dpState = this.$route.params && this.$route.params.dpState;
      console.log(dpid)
      if (dpState != 0) {
        this.state = false;
      }
      this.getList(dpid);
      this.getSupplier();
    },
    methods: {
      /* 修改采购单总价 */
      setPrice() {

        this.priceSum = null;
        for(var i = 0; i < this.drugList.length; i++){
          this.priceSum += this.drugList[i].tradePrice * this.drugList[i].drugNum
        }
        this.form.dpTotalAmount = this.priceSum
      },
      /** 查询采购单详情 */
      getList(dpid) {
        selectParticulars(dpid).then(response => {
          this.form = response.data.druPurchase;
          this.purchase = response.data.druPurchase;

          this.drugList.dpdid = response.data.drugList;

          this.drugList = response.data.drugList;

        });
      },
      /** 添加药品按钮操作 */
      handleAdd() {
        this.open = true;
        this.title = "添加药品信息";
        this.getDdTypes();
        this.getPrescriptionTypes();
        this.getDrugs();
      },
      /** 批量设置操作 */
      sets() {
        this.openTwo = true;
        this.reset();
        this.title = "批量设置";
      },
      /** 批量设置确认操作 */
      setsAffirm() {
        this.openTwo = false;

        for(var i = 0; i < this.drugList.length; i++){
          if(this.formTwo.drugNum != 0){
            this.drugList[i].drugNum = this.formTwo.drugNum
          }
          if(this.formTwo.tradePrice != 0){
            this.drugList[i].tradePrice = this.formTwo.tradePrice
          }
          if(this.formTwo.batch != undefined){
            this.drugList[i].batch = this.formTwo.batch
          }
          if(this.formTwo.remark != undefined){
            this.drugList[i].remark = this.formTwo.remark
          }
        }
        this.setPrice();
      },
      /* 删除药品信息 */
      deleteDrug(row){
        this.newDrugList = [];
        for(var i = 0; i < this.drugList.length; i++){
          if (this.drugList[i].ddid != row.ddid) {
            this.newDrugList.push(this.drugList[i])
          }
        }
        this.drugList = this.newDrugList;
        this.setPrice();
      },
      // 表单重置
      reset() {
        this.formTwo = {
          drugNum: 0,
          tradePrice: 0,
          batch: undefined,
          remark:undefined
        };
        this.resetForm("formTwo");
      },
      /** 查询所有的药品类型 */
      getDdTypes() {
        selectDdType().then(response => {
          this.ddTypes = response.rows;
        });
      },
      /** 查询所有的处方类型 */
      getPrescriptionTypes() {
        selectPrescriptionType().then(response => {
          this.prescriptionTypes = response.rows;
        });
      },
      getDrugs() {

        this.ddids = [];
        this.newAddDrugs = [];
        for(var i = 0; i < this.drugList.length; i++){
          this.ddids.push(this.drugList[i].ddid)
        }
        selectAll(this.queryParams).then(response => {
          this.addDrugs = response.rows;
          this.total = response.total;
          this.loading = false;


          var flag = true;
          for(var i = 0; i < this.addDrugs.length; i++){
            flag = true;
            for (var j = 0; j < this.addDrugs.length; j++) {
              if (this.ddids[j] == this.addDrugs[i].ddid) {
                flag = false;
              }
            }
            if (flag){
              this.newAddDrugs.push(this.addDrugs[i])
            }
          }
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.openTwo = false;
        this.reset();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.item = selection.map(item => item)
      },
      // 添加药品弹框确认按钮
      submitForm(){
        for(var i = 0; i < this.item.length; i++){
          var a = deepClone(this.druPurchaseDrug)
          a.druDrug = this.item[i];
          a.ddid = this.item[i].ddid;
          a.dpid = this.purchase.dpid;
          a.tradePrice = this.item[i].ddPrice;
          this.drugList.push(a)
        }
        this.setPrice();
        this.open = false;
      },
      /** 查询供应商列表 */
      getSupplier() {
        selectSupplier().then(response => {
          this.supplierList = response.data ;
        });
      },
      /** 暂存和按钮 */
      submitDurd: function() {

        if (this.drugList.length == 0) {
          this.msgError("请至少添加一种药品");
        }else {
          for(var i = 0; i < this.drugList.length; i++){
            this.drugList[i].dpdid = 0
          }
          suboptimal(this.drugList).then(response => {
            if(this.purchase.dsid != null && this.purchase.dsid != ''){
              updatepurchase(this.purchase).then(response => {
                this.msgSuccess("暂存成功");
              });
            }else {
              this.msgError("请选择供应商后暂存");
            }
          });
        }
      },
      /** 提交审核和按钮 */
      submitDurdTwo: function() {
        if (this.drugList.length == 0) {
          this.msgError("请至少添加一种药品");
        }else {
          for(var i = 0; i < this.drugList.length; i++){
            this.drugList[i].dpdid = 1
          }
          suboptimal(this.drugList).then(response => {
            if(this.purchase.dsid != null && this.purchase.dsid != ''){
              updatepurchase(this.purchase).then(response => {
                this.msgSuccess("提交成功");
              });
            }else {
              this.msgError("请选择供应商后提交");
            }
          });
        }
      },
    }
  };
</script>
